@import 'element-plus/theme-chalk/src/dark/css-vars.scss';

html.dark {

	//主题
	--hdq-header-primary: #24292E;
	--hdq-header-hover-primary: #181D22;
	--primary-theme-color: #2343C7;

	//背景
	#app {
		background: var(--el-bg-color);
	}



	//登录背景
	.login_bg {
		background: var(--el-bg-color);
	}

	.hdq {
		.hdq-header {
			background-color: var(--hdq-header-primary);
			border: none;

			.hdq-header-left {
				&:hover {
					background-color: #24292E;
				}
			}

			.user-bar {
				.admin-setting {
					&:hover {
						background-color: var(--hdq-header-hover-primary);
					}
				}
			}
		}

		.hdq-section {
			background-color: #000000;

			.hdq-side-scroll {
				width: 210px;
				// transition: none;
				background-color: #191A23;

				.hdq-side-bottom {
					background-color: #303139;
					border-top: none;
				}
			}

			main {
				flex: 1;
				background-color: #151515;
				.el-tabs--card>.el-tabs__header .el-tabs__item {
					border-bottom: none;
					background-color: #151515;
					color: white;
					padding: 0px 10px;
					font-size: 14px;
					border-radius: 4px;
					margin-right: 10px;
					height: 26px;
				}

				.el-tabs--card>.el-tabs__header .el-tabs__item.is-active {
					background-color: var(--primary-theme-color);
					color: white;
				}

			}
		}
	}

	.imagePage {
		.card {
			.card-body {
				.card-body-left {
					border-right: 1px solid #303030;

					.category {
						.category-box {
							.category-item {
								border-bottom: 1px solid #303030;

								&:nth-child(odd) {
									background-color: #141414;
								}

								&:nth-child(even) {
									background-color: #1E1E1E;
								}

								&:hover {
									background-color: #262626;
								}
							}
						}
					}
				}

				.card-body-right {
					.container {
						.imgList {
							.imgItem {
								border: 1px solid #303030;
							}
						}

					}
				}
			}
		}
	}

	.distribution-container .statistics-cards .statistic-card .statistic-content .statistic-info .statistic-value
	{
		color: white;
	}
	.dashboard{
		background-color: #151515;
	}
	.data-cards .card{
		background-color: #151515;
		border:1px solid #414243;
	}
	.data-cards .card .card-header{
		color: white;
	}
	.data-cards .card .card-number{
		color: white;
	}
	.data-cards .card .card-footer{
		color: white;
	}

	.menu-cards .menu-item{
		background-color: #151515;
		border:1px solid #414243;

	}
	.menu-cards .menu-item .menu-text{
		color: white;
	}
	.order-stats{
		background-color: #151515;
	}
	.stats-card{
		background-color: #151515;
		border:1px solid #414243;

	}
	.stats-card .stats-header .stats-title{
		color: white;
	}
	.store-data .store-label, .store-data .trade-label, .trade-data .store-label, .trade-data .trade-label{
		color: white;
	}

	.stats-card .stats-header .time-range span.active{
		background-color: var(--primary-theme-color);
		color: white;
	}
	.el-tabs--left .el-tabs__header.is-left, .el-tabs--left .el-tabs__header.is-right, .el-tabs--left .el-tabs__nav-scroll, .el-tabs--left .el-tabs__nav-wrap.is-left, .el-tabs--left .el-tabs__nav-wrap.is-right, .el-tabs--right .el-tabs__header.is-left, .el-tabs--right .el-tabs__header.is-right, .el-tabs--right .el-tabs__nav-scroll, .el-tabs--right .el-tabs__nav-wrap.is-left, .el-tabs--right .el-tabs__nav-wrap.is-right{
		background-color: #151515;
		color: white;
	}
	.goodsPage .goods_container_right{
		background-color: #151515;
	}

	.goodsCategoryPage .goodsCategory_container_left{
		background-color: #151515;
		border:1px solid #414243;
	}
	.goodsCategoryPage .goodsCategory_container_right{
		background-color: #151515;
		border:1px solid #414243;
	}
}